<template>
  <div class="goodsDetail fixed-top">
    <!-- 引入公共头部 -->
    <NavBar title="商品详情" fixed back/>
    <div class="detail-content" v-html="goodsDetail">
    </div>
  </div>
</template>
<script>
import NavBar from '../../components/common/NavBar.vue'
import detailAPI from '../../api/detail'
import { Toast } from 'vant'

export default {
  name: 'goodsDetail',
  data () {
    return {
      goodsDetail: {}
    }
  },
  mounted () {
    this.getGoodsDetail()
  },
  methods: {
    getGoodsDetail: function () {
      const _this = this
      detailAPI.getGoodsDetailByGoodsId(this.$route.query.goodsId).then(function (res) {
        if (res.data.success) {
          _this.goodsDetail = res.data.re[0].detail
        }
      }).catch(function () {
        Toast('加载异常！')
      })
    }
  },
  components: {
    NavBar
  }
}
</script>
<style>
  .detail-content {
    overflow: auto;
  }

  .detail-content p {
    margin: 0;
  }
  .detail-content img {
    max-width: 100%;
  }
</style>
